草庐IT

React 组件

全部标签

javascript - 遍历同一组件angular2的多个@ViewChild实例

我有一个Ionic2应用程序,它的ParentComponent调用ChildComponent@ViewChild方法来启动多个ChildComponent。其中一个ChildComponentsget在View中使用不同的参数实例化了两次,如下所示:在离线/在线设备状态更改后,我调用ChildComponent的方法来更新它返回的项目列表。@ViewChild(ChildComponent)childComponent:ChildComponent;ngOnInit():void{this.networkService.connectSubscription(()=>{this.c

javascript - React - 渲染组件的动态列表

我有一个代表自定义React组件的键列表。基于此列表,我想呈现适当的组件。我有每个组件的引用,因此我可以创建一个key->Component的映射,它允许我创建一个组件列表。但是我还没有找到一种方法来呈现这个列表。示例:input:["componentA","componentB","componentC"]output:这是我到目前为止得到的,但是我不确定如何呈现组件列表:functionrenderElements(keys){constcomponents={componentA:ComponentA,componentB:ComponentB,componentC:Compo

javascript - 为什么 react-tap-event-plugin 在我的 TypeScript 项目中不起作用?

我正在尝试使用material-ui和react-tap-event-plugin但在加载应用程序时出现此错误:react-dom.js:18238Warning:Unknownprop`onTouchTap`ontag.Removethispropfromtheelement.Fordetails,seehttps://....inbutton(createdbyEnhancedButton)inEnhancedButton(createdbyIconButton)inIconButton(createdbyAppBar)indiv(createdbyPaper)inPaper(cr

javascript - 第一次加载组件时 Angular 4 ngOnInit 不工作

我在Angular4中有一个组件和一个用于更改路由的模板这个组件被调用但不加载任何没有服务器调用的东西。如果我将ngOnInit()方法内容放入构造函数中,它就可以正常工作。似乎没有调用ngOnInit。自从过去2天以来,任何人都可以帮助我处理这个问题。这是我的路由配置。consttestRouting:ModuleWithProviders=RouterModule.forChild([{path:'createtest/:id',component:TestComponent,resolve:{test:TestResolver}},{path:'createtest',compo

javascript - React - 对未安装的 JSX 行进行适当的状态管理?

我们有一个疯狂的DOM层次结构,我们一直在props中传递JSX,而不是嵌入子元素。我们希望基类管理显示哪些子文档,以及将哪些子文档停靠或附加到其关联文档窗口的顶部。List(疯狂的物理学将内联样式写入基类包装器)自定义表单(将JSX行传递给基类)基类(连接到列表)自定义表单(将JSX行传递给基类)基类(连接到列表)问题是我们正在传递深度嵌套的JSX,状态管理/访问表单中的引用是一场噩梦。我不想每次都重新声明每一行,因为这些行在基类中附加了附加状态,基类需要知道哪些行实际发生了变化。如果我不重新声明行,这很容易。我不知道如何实际处理自定义表单中的JSX行。Refs只能附加在render

javascript - 为什么 ReactHighcharts SolidGauge 的圆形在 react 中不起作用

我使用react-highcharts在我的仪表板页面中创建一个SolidGauge。并绘制圆边。因此,我将plotOptions.rounded设置为true。代码:importReactHighchartsfrom'react-highcharts';importHighchartsMorefrom'highcharts-more';importSolidGaugefrom'highcharts-solid-gauge';HighchartsMore(ReactHighcharts.Highcharts);SolidGauge(ReactHighcharts.Highcharts)

javascript - 在外部函数中设置状态/使用状态 react

考虑这个伪代码:component.js...import{someFunc}from"./common_functions.js"exportdefaultclassMyCompextendsComponent{constructor(props){super(props);this.someFunc=someFunc.bind(this);this.state={...};}_anotherFunc=()=>{....this.someFunc();}render(){...}}common_functions.jsexportfunctionsomeFunc(){if(this.

javascript - 如何在 react.js 中允许 CORS?

我正在使用Reactjs并通过javascript中的AJAX使用API。我们如何解决这个问题?以前用过CORS工具,现在需要开启CORS。 最佳答案 在React中有6种方法可以做到这一点,number1and2and3arethebest:1-在服务端配置CORS像这样手动设置2个标题:resonse_object.header("Access-Control-Allow-Origin","*");resonse_object.header("Access-Control-Allow-Headers","Origin,X-Req

javascript - 防止将重复对象添加到状态 react redux

我有一个关于防止将重复项添加到我的redux存储的问题。它应该是直截了当的,但出于某种原因,我尝试的任何事情都没有奏效。exportconsteventReducer=(state=[],action)=>{switch(action.type){case"ADD_EVENT":return[...state,action.event].filter(ev=>{if(ev.event_id!==action.event.event_id){returnev;}});default:returnstate;}};action看起来像下面这样:{type:"ADD_EVENT",event

javascript - create-react-app - 获取本地 JSON(通过 AJAX)

我正在尝试使用create-react-app做一些相当简单的事情,从前端的其他地方动态请求JSON文件。当我请求URL时,Webpack仅返回应用程序的index页面(带有HTTP200)。我已经尝试将JSON文件放在src和public目录中,但没有任何区别(例如,/src/data/stuff.json,/public/data/stuff.json).我猜webpack/某些东西正在阻止请求通过。像fetch('http://localhost:3000/public/data/stuff.json')这样的东西是行不通的。我看到了请求,但响应只是默认的HTML。当然,http